// import React, { Component } from 'react';
import "./style.scss";
import SelecteCity from "../../../common/comps/SelecteCity";

class SortTab extends React.Component {
    constructor() {
        super();
        this.state = {
            activeSort: 0,
            show_citylist: false,
            sortList :[
                {
                    id: 0,
                    value: "默认",
                    cName: "rj_sort_item rj_active"
                },
                {
                    id: 1,
                    value: "销量",
                    cName: "rj_sort_item rj_arrow_icon"
                }
            ]
        };
    }

    render() {
      
        const { activeSort,sortList } = this.state;
        const { setCity,total } = this.props;
        return (
            <div className="rj_sort_wp">
                <div className="rj_sort_tab">
                    {sortList.map((item, index) => {
                        return (
                            <span
                                className={item.cName}
                                key={item.id}
                                onClick={() => {
                                    this.activeSortClick(item.id);
                                }}
                            >
                                {item.value}
                            </span>
                        );
                    })}

                    <div className="rj_f-r rj_sort_right">
                        <span>共</span>
                        <em>{total}</em>
                        <span>家供应商</span>
                    </div>
                    <div className={"rj_national2"}>
                        <SelecteCity setCity={setCity} />
                    </div>
                </div>
            </div>
        );
    }

    activeSortClick = id => {
        // if(id===this.state.activeSort) return;
        let list = this.state.sortList;
        let sortId = id;
        if(id==1) {
            if(this.state.activeSort==1) {
                sortId = 2;
            }
            if(this.state.activeSort==2) {
                sortId = 1;
            }
            list[1].cName = 'rj_sort_item rj_active rj_sort_item_active';
            list[0].cName = 'rj_sort_item';
        }
        if(id==0) {
            list[0].cName = 'rj_sort_item rj_active';
            list[1].cName = 'rj_sort_item rj_arrow_icon';
        }
        this.setState(
            {
                activeSort: sortId,
                sortList:list
            }
        );
        this.props.sortList(sortId)


    };
}

export default SortTab;
